html {
	position: relative;
	min-height: 100%;
}
body {
	padding-top: 50px;

	/* footer + 15px margin */
	margin-bottom: 65px;
}

.footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 50px;
  background-color: #f5f5f5;
}

.footer > .container {
	line-height: 50px;
}

.footer p { 
	margin: 0;
}

.container {
	max-width: 900px;
}

.max-width-250px { max-width: 250px; }
.max-width-400px { max-width: 400px; }
.margin-left-5px { margin-left: 5px; }
.margin-bottom-5px { margin-bottom: 5px; }
.margin-bottom-10px { margin-bottom: 10px; }
.margin-bottom-15px { margin-bottom: 15px; }
.padding-15px { padding: 15px; }

input.invalid, textarea.invalid, select.invalid {
	border-color: #F00;
}

.table-nonfluid {
   width: auto !important;
}

.input-group-addon.middle {
	border-left-width: 0;
    border-right-width: 0;
}

.btn-primary > img.icon {
	height: 24px;
    margin: -6px -2px -4px -8px;
}

.navbar-inverse .navbar-toggle {
	border: none;
}

.white-space-pre-wrap {
	white-space: pre-wrap;
}

div.color-preview {
    height: 72px;
    width: 72px;
    border-radius: 3px;
    margin-right: 10px;
}

.tool-info {
    padding: 16px 0;
}

.tool-info:hover .tool-name, .tool-info:hover .tool-description {
  color: #000;
}

.tool-info a:hover, .tool-info a:active, .tool-info a:focus {
  text-decoration: none;
}

.tool-info:not(:first-child) {
    border-top: 1px solid #e0e0e0;
}

.tool-name {
    font-size: 16px;
    color: #212121;
    font-weight: 400;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.tool-description {
    font-size: 14px;
    color: #757575;
    font-weight: 400;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.cookie-footer, .tool-page-bottom-ad {
  margin: 15px 0 0;
}

.cookie-footer table {
  width: 100%;
}

.cookie-footer table td:last-child {
    text-align: right;
}

img.nav-logo {
    height: 30px;
    margin-top: -5px;
}

textarea {
  resize: vertical;
}

.break-word {
  word-wrap: break-word;
}


/* navigation GitHub link */

nav .github-link {
  position: absolute; 
  right: 0;
  height: 50px;
}

nav .github-link polygon {
  fill: rgba(255, 255, 255, 0.2);
}
nav .github-link svg:hover polygon {
  fill: rgba(255, 255, 255, 0.3);
}
nav .github-link svg:active polygon {
  fill: rgba(255, 255, 255, 0.5);
}

nav .github-link path {
  fill: #FFF;
}

@media (max-width: 767px) {
  nav .github-link {
    display: none;
  }
}


/* override Bootstrap styles */
.navbar-inverse .navbar-toggle:focus, .navbar-inverse .navbar-toggle:hover {
  background-color: transparent;
}

.vcenter {
  display: inline-block;
  vertical-align: middle;
  float: none;
}